<template>
	<view class="card order-item">
		<div class="order-item-hd u-flex u-col-center u-row-between">
			<text>下单时间：{{ orderinfo.created_at }}</text>
			<text class="text-primary">{{ orderinfo.status_ }}</text>
		</div>
		<div class="goodsinfo u-flex  ">
			<div class="imgbox"><image :src="orderinfo.product_img[0] + '?imageView2/0/w/140'" mode="widthFix"></image></div>
			<div class="flex-sub u-flex u-flex-column">
				<div class="u-flex u-row-between">
					<div class="name">{{ orderinfo.product_name }}</div>
					<text class="num">×{{ orderinfo.qty }}</text>
				</div>
				<div class="tag flex-sub">{{ orderinfo.title || '' }}</div>
				<div class="u-flex u-col-center u-row-between">
					<div class="price">
						<text class="unit">￥</text>
						{{ orderinfo.price }}
					</div>
					<div class="tkprice">
						{{ ordertype == 1 ? '申请金额' : '总金额' }}:
						<text>￥{{ orderinfo.amount }}</text>
					</div>
				</div>
			</div>
		</div>
		<div class="order-item-ft u-flex u-col-center u-row-between">
			<div class="shopname">{{ orderinfo.supplier_name || '' }}</div>
			<div class="btnlist">
				<view class="btn" @tap="details">{{ ordertype == 1 ? '查看详情' : orderinfo.evaluate == 1 ? '查看评价' : '去评价' }}</view>
			</div>
		</div>
	</view>
</template>

<script>
export default {
	data() {
		return {
			state: 0
		};
	},
	props: {
		orderinfo: {
			type: Object,
			default: {}
		},
		ordertype: {
			type: [String, Number],
			default: 0 //0 评价 1售后
		}
	},
	created() {
		// console.log("评价订单信息" + JSON.stringify(this.orderinfo))
	},
	methods: {
		details() {
			let url = '';
			console.log('this.ordertype', this.ordertype);
			if (this.ordertype == 0) {
				if (this.orderinfo.evaluate == 1) {
					url = '/pages/order/evaluate/details?order_product_id=' + this.orderinfo.order_product_id;
				} else {
					url = '/pages/order/evaluate/send?id=' + this.orderinfo.pid + '&order_product_id=' + this.orderinfo.order_product_id;
				}
			} else {
				url = '/pages/order/afterSales/details?order_product_id=' + this.orderinfo.order_product_id;
			}
			uni.navigateTo({
				url: url
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.order-item {
	background: #fff;
	color: $u-main-color;
	font-size: 26upx;
	margin-bottom: 25upx;
	&.card {
		border-top: none;
		padding: 0;
	}

	.order-item-hd,
	.order-item-ft {
		padding: 30upx 32upx;
	}
	.order-item-ft {
		padding-top: 20upx;
	}
	.order-item-hd,
	.goodsinfo {
		border-bottom: 1px solid #e5e5e5;
	}

	.btnlist {
		.btn {
			display: block;
			color: #fff;
			text-align: center;
			border-radius: 15upx;
			width: 200upx;
			height: 70upx;
			line-height: 70upx;
			background: linear-gradient(90deg, #ff8173 0%, #ff3543 100%);
			border-radius: 35upx;
		}
	}

	.goodsinfo {
		padding: 30upx 32upx;
		.imgbox {
			width: 160upx;
			height: 160upx;
			margin-right: 25upx;
			border-radius: 8upx;
			overflow: hidden;
			image {
				display: block;
				width: 100%;
				height: 100%;
			}
		}

		.name {
			color: $u-main-color;
			font-size: 32upx;
			font-weight: 500;
			line-height: 45upx;
		}

		.num {
			color: var(--nav-bg);
			font-size: 28upx;
			font-weight: bold;
		}

		.tag {
			color: $u-content-color;
			font-size: 24upx;
			margin: 8upx 0;
		}

		.price {
			.unit {
				font-size: 24upx;
			}
			color: var(--nav-bg);
			font-weight: bold;
			font-size: 32upx;
		}

		.tkprice {
			font-size: 26upx;
			text {
				color: var(--nav-bg);
			}
		}
	}
}
</style>
